/**
 * 消息提示组件深色主题优化
 * 优化 ElMessage、ElMessageBox、ElNotification 等组件在深色模式下的样式
 */

// 深色模式下的消息提示样式
.dark {
  // ElMessage 消息提示
  .el-message {
    background: var(--bg-color) !important;
    border: 1px solid var(--border-color) !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.6) !important;
    color: var(--text-color-primary) !important;
    
    .el-message__content {
      color: var(--text-color-primary) !important;
    }
    
    .el-message__icon {
      color: inherit !important;
    }
    
    // 不同类型的消息样式
    &.el-message--success {
      background: var(--bg-color) !important;
      border-color: var(--color-success) !important;
      
      .el-message__icon {
        color: var(--color-success) !important;
      }
    }
    
    &.el-message--warning {
      background: var(--bg-color) !important;
      border-color: #c67915 !important; // 使用指定的辅助颜色1
      
      .el-message__icon {
        color: #c67915 !important;
      }
    }
    
    &.el-message--error {
      background: var(--bg-color) !important;
      border-color: #c35c5d !important; // 使用指定的辅助颜色2
      
      .el-message__icon {
        color: #c35c5d !important;
      }
    }
    
    &.el-message--info {
      background: var(--bg-color) !important;
      border-color: var(--color-info) !important;
      
      .el-message__icon {
        color: var(--color-info) !important;
      }
    }
  }
  
  // ElMessageBox 确认对话框
  .el-message-box {
    background: var(--bg-color) !important;
    border: 1px solid var(--border-color) !important;
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.8) !important;
    
    .el-message-box__header {
      border-bottom: 1px solid var(--border-color) !important;
      
      .el-message-box__title {
        color: var(--text-color-primary) !important;
      }
      
      .el-message-box__headerbtn {
        .el-message-box__close {
          color: var(--text-color-secondary) !important;
          
          &:hover {
            color: var(--text-color-primary) !important;
          }
        }
      }
    }
    
    .el-message-box__content {
      color: var(--text-color-regular) !important;
      
      .el-message-box__message {
        color: var(--text-color-regular) !important;
      }
      
      .el-message-box__status {
        &.el-icon-success {
          color: var(--color-success) !important;
        }
        
        &.el-icon-warning {
          color: #c67915 !important;
        }
        
        &.el-icon-error {
          color: #c35c5d !important;
        }
        
        &.el-icon-info {
          color: var(--color-info) !important;
        }
      }
    }
    
    .el-message-box__btns {
      border-top: 1px solid var(--border-color) !important;
      
      .el-button {
        &.el-button--default {
          background: var(--fill-color) !important;
          border-color: var(--border-color) !important;
          color: var(--text-color-regular) !important;
          
          &:hover {
            background: var(--fill-color-light) !important;
            border-color: var(--border-color-light) !important;
            color: var(--text-color-primary) !important;
          }
        }
        
        &.el-button--primary {
          background: var(--color-primary) !important;
          border-color: var(--color-primary) !important;
          
          &:hover {
            background: var(--color-primary-light-3) !important;
            border-color: var(--color-primary-light-3) !important;
          }
        }
      }
    }
  }
  
  // ElNotification 通知
  .el-notification {
    background: var(--bg-color) !important;
    border: 1px solid var(--border-color) !important;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.6) !important;
    
    .el-notification__title {
      color: var(--text-color-primary) !important;
    }
    
    .el-notification__content {
      color: var(--text-color-regular) !important;
    }
    
    .el-notification__closeBtn {
      color: var(--text-color-secondary) !important;
      
      &:hover {
        color: var(--text-color-primary) !important;
      }
    }
    
    .el-notification__icon {
      &.el-icon-success {
        color: var(--color-success) !important;
      }
      
      &.el-icon-warning {
        color: #c67915 !important;
      }
      
      &.el-icon-error {
        color: #c35c5d !important;
      }
      
      &.el-icon-info {
        color: var(--color-info) !important;
      }
    }
  }
  
  // ElAlert 警告提示
  .el-alert {
    background: var(--fill-color) !important;
    border: 1px solid var(--border-color) !important;
    
    .el-alert__title {
      color: var(--text-color-primary) !important;
    }
    
    .el-alert__description {
      color: var(--text-color-regular) !important;
    }
    
    .el-alert__closebtn {
      color: var(--text-color-secondary) !important;
      
      &:hover {
        color: var(--text-color-primary) !important;
      }
    }
    
    &.el-alert--success {
      background: rgba(103, 194, 58, 0.1) !important;
      border-color: var(--color-success) !important;
      
      .el-alert__icon {
        color: var(--color-success) !important;
      }
    }
    
    &.el-alert--warning {
      background: rgba(198, 121, 21, 0.1) !important;
      border-color: #c67915 !important;
      
      .el-alert__icon {
        color: #c67915 !important;
      }
    }
    
    &.el-alert--error {
      background: rgba(195, 92, 93, 0.1) !important;
      border-color: #c35c5d !important;
      
      .el-alert__icon {
        color: #c35c5d !important;
      }
    }
    
    &.el-alert--info {
      background: rgba(144, 147, 153, 0.1) !important;
      border-color: var(--color-info) !important;
      
      .el-alert__icon {
        color: var(--color-info) !important;
      }
    }
  }
  
  // ElLoading 加载遮罩
  .el-loading-mask {
    background: rgba(44, 47, 59, 0.8) !important;
    
    .el-loading-spinner {
      .el-loading-text {
        color: var(--text-color-primary) !important;
      }
      
      .circular {
        .path {
          stroke: var(--color-primary) !important;
        }
      }
    }
  }
  
  // ElDrawer 抽屉
  .el-drawer {
    background: var(--bg-color) !important;
    
    .el-drawer__header {
      border-bottom: 1px solid var(--border-color) !important;
      
      .el-drawer__title {
        color: var(--text-color-primary) !important;
      }
      
      .el-drawer__close-btn {
        color: var(--text-color-secondary) !important;
        
        &:hover {
          color: var(--text-color-primary) !important;
        }
      }
    }
    
    .el-drawer__body {
      color: var(--text-color-regular) !important;
    }
  }
  
  // ElPopover 弹出框
  .el-popover {
    background: var(--bg-color) !important;
    border: 1px solid var(--border-color) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.6) !important;
    color: var(--text-color-regular) !important;
    
    .el-popover__title {
      color: var(--text-color-primary) !important;
    }
  }
  
  // ElPopconfirm 气泡确认框
  .el-popconfirm {
    background: var(--bg-color) !important;
    border: 1px solid var(--border-color) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.6) !important;
    
    .el-popconfirm__main {
      color: var(--text-color-regular) !important;
      
      .el-popconfirm__icon {
        color: #c67915 !important;
      }
    }
    
    .el-popconfirm__action {
      .el-button {
        &.el-button--small.el-button--default {
          background: var(--fill-color) !important;
          border-color: var(--border-color) !important;
          color: var(--text-color-regular) !important;
          
          &:hover {
            background: var(--fill-color-light) !important;
            border-color: var(--border-color-light) !important;
            color: var(--text-color-primary) !important;
          }
        }
      }
    }
  }
}

// 全局遮罩层优化
.dark .el-overlay {
  background: rgba(36, 39, 50, 0.8) !important;
}

// 确保所有弹出层都有正确的层级和背景
.dark .el-popper {
  background: var(--bg-color) !important;
  border: 1px solid var(--border-color) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.6) !important;
  
  &.is-dark {
    background: var(--bg-color) !important;
    color: var(--text-color-primary) !important;
  }
  
  .el-popper__arrow::before {
    background: var(--bg-color) !important;
    border: 1px solid var(--border-color) !important;
  }
}
